<template>
	<view class="box" @click="go('/pages/detail/detail?id='+item.id)">
		<image :src="item.image" mode="aspectFill"></image>
		<view class="msg">
			<view class="title text_ellipsis">
				{{item.title}}
			</view>
			<view class="type">
				类别：{{item.type_name}}
			</view>
			<view class="price f_z_b f_j">
				<view class="num">
					<text class="icon">￥</text>
					<text v-if="item.gg_count > 1">{{item.min_dl_price}}~{{item.max_dl_price}}</text>
					<text v-else>{{item.min_dl_price}}</text>
				</view>
				<view class="add" v-if="type!=2">
					<image src="../../static/public/add_car.png" mode=""></image>
				</view>
			</view>
		</view>

	</view>
</template>

<script>
	export default {
		props: ['type', 'item'],
		name: "commodity_card",
		data() {
			return {

			};
		},
		mounted() {
			console.log(this)
		},
		methods: {}
	}
</script>

<style lang="scss">
	.box {
		margin-bottom: 24rpx;
		width: 329rpx;
		border-radius: 10rpx 10rpx 10rpx 10rpx;
		background: #FFFFFF;
		overflow: hidden;

		image {
			width: 100%;
			height: 213rpx;
			vertical-align: bottom;
		}

		.msg {
			padding: 14rpx;

			.title {
				// margin-top: 15rpx;
				font-weight: 700;
				font-size: 26rpx;
				color: #343434;
			}

			.type {
				margin-top: 15rpx;
				font-weight: 400;
				font-size: 24rpx;
				color: #666666;
			}

			.price {
				margin-top: 15rpx;

				.num {
					font-weight: 700;
					font-size: 30rpx;
					color: #E1222A;

					.icon {
						font-size: 24rpx;
					}
				}
			}

			.add {
				image {
					width: 35rpx;
					height: 35rpx;
				}
			}
		}
	}
</style>